feat(Blocks): new Mistica Community Components #770

daviteixeira-tlf · 2023-05-31T20:31:18Z

No description provided.

github-actions · 2023-05-31T20:33:44Z

Size stats

	master	this branch	diff
Total JS	9.35 MB	9.36 MB	+8.35 kB
JS without icons	866 kB	874 kB	+8.35 kB
Lib overhead	122 kB	122 kB	0 B
Lib overhead (gzip)	31.8 kB	31.8 kB	0 B

github-actions · 2023-05-31T20:38:38Z

Accessibility report
✔️ No issues found

ℹ️ You can run this locally by executing yarn audit-accessibility.

github-actions · 2023-05-31T20:39:55Z

Deploy preview for mistica-web ready!

✅ Preview
https://mistica-ppcoxn99o-tuentisre.vercel.app

Built with commit 0050e59.
This pull request is being automatically deployed with vercel-action

github-actions · 2023-05-31T20:47:15Z

Screenshot tests report

✔️ All passing

src/advanced-slots.tsx

yceballost · 2023-06-06T22:35:12Z

src/blocks.tsx

+            }}
+            aria-label={ariaLabel}
+        >
+            {(title || stackingGroup || description) && (


I find the behavior of "not having the title prop, the stackingGroup is not showing" quite odd.
https://tinyurl.com/2lalc6qz

I would appreciate the flexibility to use this component with just the title + progress, or solely with the stackingGroup + progress, for example

I plan to discuss this matter with the Vivo design team to propose a change.

atabel · 2023-06-12T15:11:36Z

Please, include a link to figma specs in the PR

src/blocks.tsx

src/advanced-slots.tsx

src/blocks.tsx

src/community/__stories__/blocks-story.tsx

src/community/blocks.tsx

atabel · 2023-07-06T09:43:11Z

src/community/blocks.tsx

+    secondHeading?: {
+        value: string;
+        text: string;
+    };
+
+    secondaryValue?: string;


hmmm.. I still see this quite confusing. Can I have secondHeading and secondaryValue at the same time in the component?

src/community/blocks.tsx

atabel · 2023-07-06T09:50:31Z

src/community/blocks.tsx

+    title?: string;
+    stackingGroup?: RendersNullableElement<typeof StackingGroup>;
+
+    progressPercent?: number;
+    reverse?: boolean;
+
+    value: string;
+    text: string;
+    description?: string;
+
+    valueColor?: string;
+    'aria-label'?: string;


It doesn't make sense to have a ProgressBlock without a ProgresBar If figma specs say so, then figma specs must be wrong.

Why did you changed value to accept number? if it should only accept numbers, then type it as number, if it should accept any string then type it as string but don't type it as number | string, please

src/community/blocks.tsx

atabel · 2023-07-07T07:12:23Z

src/community/blocks.tsx

+    title?: string;
+    stackingGroup?: RendersNullableElement<typeof StackingGroup>;
+
+    progressPercent?: number;
+    reverse?: boolean;
+
+    value: string;
+    text: string;
+    description?: string;
+
+    valueColor?: string;
+    'aria-label'?: string;


Then, what's the difference between a ProgressBlock without progress and a HighlightedValueBlock?

<ProgressBlock heading={{value: 34, text: 'some text'}} description="some description"/> <HighlightedValueBlock mainHeading={{value: 34, text: 'some text'}} description="some description" />

Winde · 2023-07-11T12:07:19Z

src/community/blocks.tsx

+        <div aria-label={ariaLabel}>
+            {headline && <Box paddingBottom={24}>{headline}</Box>}
+
+            <Stack space={2}>


Is this component the one to render this?

For first slot:
I assume 300 Mega => would be mainHeading.value
I assume de velocidade => would be mainHeading.text

But there's no possibility of putting a text above this mainHeading for "Vivo Fibra 300 Mbps Especial Netflix_1"
As headline is a Tag.

For second slot, similar problem:

I assume 110 canais is => mainHeading.value

But mainHeading.text is mandatory.
And there's no possibility of putting a text above this mainHeading for "Vivo Play Avançado HD"
As headline is a Tag.

The other alternative is that we are supposed to use the ProgressBlock for this but without a progress bar?
But heading.text is mandatory, so we also cannot do the case for TV.

Note: screenshot tests for the actual cases we want to use would be helpful in identifying which block to be used in each case.

@BrunoGuimaraes103, this is important. Can you check the definition with the designers? The blocks should be able to cover these cases

We are checking about it

@Winde Sorry, I'm kind of confused on what you mean, could you be a little clearer?

The use cases in question can be done using ProgressBlock and ValueBlock as shown in this image:

It's a bit weird:
(1) to have to use a Progress block without progress bar
(2) That these two cases are actually different blocks

but fair enough :)

yes, it's quite weird. I said the same in other comment :(

Winde

Check the use case for landline and TV, there's some type misalignment

Neither Highlighted nor Progress blocks seem fit to do those cases

src/community/blocks.tsx

atabel · 2023-07-12T06:43:20Z

src/community/blocks.tsx

+        <div aria-label={ariaLabel}>
+            {headline && <Box paddingBottom={24}>{headline}</Box>}
+
+            <Stack space={2}>


yes, it's quite weird. I said the same in other comment :(

src/community/blocks.tsx

… and string

# [14.18.0](v14.17.1...v14.18.0) (2023-07-20) ### Bug Fixes * **DisplayMediaCard, PosterCard:** add label to video control ([#823](#823)) ([dc765ef](dc765ef)) * **row:** add missing dataAttributes ([#815](#815)) ([47e7cab](47e7cab)) ### Features * **AdvancedDataCard:** new community component ([#780](#780)) ([2803b9c](2803b9c)) * **Blocks:** new Mistica Community Components ([#770](#770)) ([8fc368a](8fc368a)) * **Header:** small version, allow removing vertical padding ([#822](#822)) ([448387e](448387e)) * **Nakedcard:** new component ([#819](#819)) ([688bb8e](688bb8e))

tuentisre · 2023-07-20T08:12:33Z

🎉 This PR is included in version 14.18.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

add: AdvancedSlots

f221837

add: slots on index

01f1f1f

daviteixeira-tlf added 2 commits June 1, 2023 10:38

add: description on ProgressBlock

657d79e

fix: ValueBlock, InformationBlock and HighlightedValueBlock description

e92fcb9

daviteixeira-tlf requested review from atabel and yceballost June 1, 2023 18:18

yceballost requested changes Jun 1, 2023

View reviewed changes

fix: PR Adjustments

6dab710

daviteixeira-tlf requested a review from yceballost June 2, 2023 13:38

yceballost requested a review from wyunreal June 2, 2023 16:05

daviteixeira-tlf added 2 commits June 2, 2023 13:46

fix: content name and SimpleBlock linesMax

18c4037

fix: ProgressBlock process reverse

0571f51

yceballost requested a review from kydorn June 5, 2023 15:02

brunocezar-tlf added 2 commits June 6, 2023 14:24

create slider component

c2b0328

Merge remote-tracking branch 'origin' into slider-component

32d9eaa

yceballost reviewed Jun 6, 2023

View reviewed changes

src/advanced-slots.tsx Outdated Show resolved Hide resolved

yceballost reviewed Jun 6, 2023

View reviewed changes

brunocezar-tlf and others added 6 commits June 7, 2023 15:13

correction merger

7d74924

Merge branch 'master' of https://github.com/Telefonica/mistica-web

69dd26a

fix: SimpleBlock remove truncate

8d33b9b

Merge branch 'master' of https://github.com/Telefonica/mistica-web

b605333

adjustment for merger with chip

8d690bf

re-test theme variant

fd5c14e

atabel reviewed Jun 12, 2023

View reviewed changes

src/blocks.tsx Outdated Show resolved Hide resolved

src/blocks.tsx Outdated Show resolved Hide resolved

src/advanced-slots.tsx Outdated Show resolved Hide resolved

wyunreal approved these changes Jun 12, 2023

View reviewed changes

src/blocks.tsx Outdated Show resolved Hide resolved

brunocezar-tlf requested a review from atabel July 5, 2023 18:35

atabel reviewed Jul 6, 2023

View reviewed changes

brunocezar-tlf added 2 commits July 6, 2023 09:26

fix: remove arialabel in storybook

d8205bd

fix: code otimization and creation of folder screenshot in community

de8d12c

brunocezar-tlf requested a review from atabel July 6, 2023 13:56

atabel requested changes Jul 7, 2023

View reviewed changes

brunocezar-tlf added 2 commits July 7, 2023 10:14

fix: prop and validation changes in row highlighted and progress blocks

ec64bb1

fix: storybook and test for row block

7f2c4c9

brunocezar-tlf requested a review from atabel July 7, 2023 14:04

Winde reviewed Jul 11, 2023

View reviewed changes

Winde self-requested a review July 11, 2023 12:11

Winde approved these changes Jul 11, 2023

View reviewed changes

Winde requested changes Jul 11, 2023

View reviewed changes

fix: change props type from number to string

2fcaa8b

Winde self-requested a review July 12, 2023 05:18

Winde approved these changes Jul 12, 2023

View reviewed changes

atabel requested changes Jul 12, 2023

View reviewed changes

fix: blockcontent refining

1970046

brunocezar-tlf requested a review from atabel July 12, 2023 16:42

atabel requested changes Jul 13, 2023

View reviewed changes

src/community/blocks.tsx Outdated Show resolved Hide resolved

Add support for multiple lines in description, allowing Array<string>…

0050e59

… and string

atabel approved these changes Jul 13, 2023

View reviewed changes

atabel changed the title ~~feat(blocks): new components~~ feat(Blocks): new Mistica Community Components Jul 13, 2023

atabel added this pull request to the merge queue Jul 13, 2023

Merged via the queue into master with commit 8fc368a Jul 13, 2023
10 checks passed

atabel deleted the advanced-slots branch July 13, 2023 13:59

tuentisre added the released label Jul 20, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(Blocks): new Mistica Community Components #770

feat(Blocks): new Mistica Community Components #770

daviteixeira-tlf commented May 31, 2023

github-actions bot commented May 31, 2023 •

edited

Loading

github-actions bot commented May 31, 2023 •

edited

Loading

github-actions bot commented May 31, 2023 •

edited

Loading

github-actions bot commented May 31, 2023 •

edited

Loading

yceballost Jun 6, 2023

atabel commented Jun 12, 2023

atabel Jul 6, 2023

atabel Jul 6, 2023

atabel Jul 7, 2023

Winde Jul 11, 2023 •

edited

Loading

atabel Jul 11, 2023

brunocezar-tlf Jul 11, 2023

brunocezar-tlf Jul 11, 2023

Winde Jul 12, 2023

atabel Jul 12, 2023

Winde left a comment

atabel Jul 12, 2023

tuentisre commented Jul 20, 2023

feat(Blocks): new Mistica Community Components #770

feat(Blocks): new Mistica Community Components #770

Conversation

daviteixeira-tlf commented May 31, 2023

github-actions bot commented May 31, 2023 • edited Loading

github-actions bot commented May 31, 2023 • edited Loading

github-actions bot commented May 31, 2023 • edited Loading

github-actions bot commented May 31, 2023 • edited Loading

Choose a reason for hiding this comment

atabel commented Jun 12, 2023

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Winde Jul 11, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Winde left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

tuentisre commented Jul 20, 2023

github-actions bot commented May 31, 2023 •

edited

Loading

github-actions bot commented May 31, 2023 •

edited

Loading

github-actions bot commented May 31, 2023 •

edited

Loading

github-actions bot commented May 31, 2023 •

edited

Loading

Winde Jul 11, 2023 •

edited

Loading